<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>{stl.sitename} | 首页</title>
    <stl:include file="/include/head.html"></stl:include>
    <style type="text/css">
        .item-banner{
            background: #f5f5f5;
        }

        .item-banner img{
            width: 100%;
        }
    </style>
</head>
<body>

<div class="home">

    <stl:include file="/include/header.html"></stl:include>

    <div class="content">
        <div class="home-page container">
            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8">
                    <!--BEGIN NEW COURSES-->
                    <div class="section section-carousel">
                        <h4>新课速递</h4>

                        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                            <!-- Indicators -->
                            <ol class="carousel-indicators">
                                <li data-target="#carousel-example-generic" data-slide-to="0" class=""></li>
                                <li data-target="#carousel-example-generic" data-slide-to="1" class="active"></li>
                                <li data-target="#carousel-example-generic" data-slide-to="2" class=""></li>
                            </ol>

                            <!-- Wrapper for slides -->
                            <div class="carousel-inner" role="listbox">
                                
                                
                                <div class="item">

                                    <div class="row hidden-xs">

                                        <stl:contents isTop="true" scope="All" totalNum="2">

                                            <div class="col-xs-12 col-sm-6 col-sm-6 col-md-6">
                                                <div class="thumbnail">
                                                    <stl:a>
                                                        
                                                        <div style="background-image: url({content.ImageUrl}); background-size: cover; width: 100%; height: 250px;">
                                                        </div>
                                                    </stl:a>
                                                    
                                                    <div class="caption">
                                                        <stl:a><p><stl:content type="Title" wordNum="18" ></stl:content></p></stl:a>
                                                    </div>
                                                </div>
                                            </div>

                                        </stl:contents>

                                    </div>

                                    <div class="row visible-xs-block">

                                        <stl:contents isTop="true" scope="All" totalNum="1">

                                            <div class="col-xs-12 col-sm-6 col-sm-6 col-md-6">
                                                <div class="thumbnail">
                                                    <stl:a>
                                                        <div style="background-image: url({content.ImageUrl}); background-size: cover; width: 100%; height: 165px;">
                                                        </div>
                                                    </stl:a>
                                                    
                                                    <div class="caption">
                                                        <stl:a><p><stl:content type="Title" wordNum="16" ></stl:content></p></stl:a>
                                                    </div>
                                                </div>
                                            </div>

                                        </stl:contents>

                                    </div>
                                </div>

                                <div class="item active">
                                    <div class="row hidden-xs">
                                        <stl:contents isTop="true" scope="All" totalNum="2" startNum="3">

                                            <div class="col-xs-12 col-sm-6 col-sm-6 col-md-6">
                                                <div class="thumbnail">
                                                    
                                                    <stl:a>
                                                        <div style="background-image: url({content.ImageUrl}); background-size: cover; width: 100%; height: 250px;">
                                                        </div>
                                                    </stl:a>
                                                    
                                                    
                                                    <div class="caption">
                                                        <stl:a>
                                                            <p>
                                                                <stl:content type="Title" wordNum="18" ></stl:content>
                                                            </p>
                                                        </stl:a>
                                                    </div>
                                                </div>
                                            </div>

                                        </stl:contents>

                                    </div>

                                    <div class="row visible-xs-block">

                                        <stl:contents isTop="true" scope="All" totalNum="1" startNum="3">

                                            <div class="col-xs-12 col-sm-6 col-sm-6 col-md-6">
                                                <div class="thumbnail">
                                                    <stl:a>
                                                        <div style="background-image: url({content.ImageUrl}); background-size: cover; width: 100%; height: 165px;">
                                                        </div>
                                                    </stl:a>
                                                    
                                                    <div class="caption">
                                                        <stl:a><p><stl:content type="Title" wordNum="16" ></stl:content></p></stl:a>
                                                    </div>
                                                </div>
                                            </div>

                                        </stl:contents>

                                    </div>
                                </div>

                                <div class="item">
                                    <div class="row hidden-xs">

                                        <stl:contents isTop="true" scope="All" totalNum="2" startNum="5">

                                            <div class="col-xs-12 col-sm-6 col-sm-6 col-md-6">
                                                <div class="thumbnail">
                                                    <stl:a>
                                                        <div style="background-image: url({content.ImageUrl}); background-size: cover; width: 100%; height: 250px;">
                                                        </div>
                                                    </stl:a>
                                                    
                                                    <div class="caption">
                                                        <stl:a><p><stl:content type="Title" wordNum="18" ></stl:content></p></stl:a>
                                                    </div>
                                                </div>
                                            </div>

                                        </stl:contents>

                                        
                                    </div>

                                    <div class="row visible-xs-block">

                                        <stl:contents isTop="true" scope="All" totalNum="1" startNum="5">

                                            <div class="col-xs-12 col-sm-6 col-sm-6 col-md-6">
                                                <div class="thumbnail">
                                                    <stl:a>
                                                        <div style="background-image: url({content.ImageUrl}); background-size: cover; width: 100%; height: 165px;">
                                                        </div>
                                                    </stl:a>
                                                    
                                                    <div class="caption">
                                                        <stl:a><p><stl:content type="Title" wordNum="16" ></stl:content></p></stl:a>
                                                    </div>
                                                </div>
                                            </div>

                                        </stl:contents>

                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    
                    <!--END NEW COURSES-->

                    <!--BEGIN BEST-COURSES-->
                    <div style="margin-bottom: 20px;">

                        <a href="{stl:a channelIndex='精品'}" class="nav_jpkc"></a>
                    </div>
                    <!--END BEST-COURSES-->

                    <!--BEGIN HOT-COURSES-->
                    <div class="section hot-course">
                        <h4>最热门课程榜</h4>
                        <ul class="row">

                            
                            <stl:contents scope="All" totalNum="6" isHot="true">
                            <li class="item col-xs-12 col-sm-6 col-md-4 col-lg-4">
                                <stl:a>
                                    <div class="item-banner" style="background-image: url({content.ImageUrl}); background-size: cover; width: 100%; height: 165px;">
                                    </div>
                                </stl:a>
                                <div class="item-card">
                                    <stl:a class="f-18 f-hot f-weight card-name"><stl:content type="Title" wordNum="14"></stl:a>

                                    <div class="hidden-md">
                                        <stl:a class="tag tag-info tag-sm" channelIndex="{channel.ChannelIndex}">{channel.ChannelName}</stl:a>
                                    </div>
                                    
                                </div>
                            </li>
                            </stl:contents>
                            

                        </ul>

                    </div>
                    <!--END HOT-COURSES-->


                </div>
                <div class="home-sub col-xs-12 col-sm-12 col-md-4 col-lg-4">
                    <div class="hot-tag section">
                        <h4>课程分类</h4>
                        
                        <div class="tag-section">
                        <stl:channels channelName="课程">
                            <a class="tag tag-info" href="{channel.NavigationUrl}">{channel.Title}({stl:count})</a>
                        </stl:channels>
                        </div>
                        
                    </div>

                    <stl:include file="/include/card_studycharts.html"></stl:include>
                </div>
            </div>
        </div>
    </div>

</div>

<stl:include file="/include/footer.html"></stl:include>
<stl:include file="/include/bottom-bar.html"></stl:include>
<stl:include file="/include/bottom.html"></stl:include>
<script src="js/index.js"></script>
<script>
    $("#nav-index").addClass('active');
</script>

</body></html>